<template>
  <div class="mod-config">
    <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
      <el-tab-pane
        v-for="(item, index) in tableList"
        :key="index"
        :label="item.meterName"
        :name="item.meterNo"
      >
      </el-tab-pane>
      <carousel-theme v-if="activeName === 'first'" ref="carouselTheme" :key="new Date().getTime()"></carousel-theme>
      <carousel-widge v-if="activeName === 'second'" ref="carouselWidge" :key="new Date().getTime()" ></carousel-widge>
      <carousel-wallpaper v-if="activeName === 'third'" ref="carouselWallpaper" :key="new Date().getTime()"></carousel-wallpaper>
    </el-tabs>
  </div>
</template>

<script>
import CarouselTheme from './carousel-theme'
import CarouselWidge from './carousel-widge'
import CarouselWallpaper from './carousel-wallpaper'

export default {
    data () {
      return {
        activeName: "first",
        tableList: [
          {
            "meterNo": "first",
            "meterName": "主题轮播图",
          },{
            "meterNo": "second",
            "meterName": "组件轮播图",
          },{
            "meterNo": "third",
            "meterName": "壁纸轮播图",
          }
        ],
      }
    },
    components: {
      CarouselTheme,
      CarouselWidge,
      CarouselWallpaper
    },
    activated () {
      console.log("默认当前页" + this.activeName)
    },
    methods: {
      handleClick() {
        // 这样大家就可以拿到了
        console.log("当前点击页" + this.activeName)
        if (this.activeName === "first"){
          this.$nextTick(() => {
            this.$refs.carouselTheme.getDataList(123)
          })
        }
        if (this.activeName === "second"){
          this.$nextTick(() => {
            this.$refs.carouselWidge.getDataList(456)
          })
        }
        if (this.activeName === "third"){
          this.$nextTick(() => {
            this.$refs.carouselWallpaper.getDataList(789)
          })
        }
      },
    }
  }
</script>
